<template>
    <div class="text-box">
        <div class="text-item pc">
            <AnimateBorderChase>
                <h2>人生格言</h2>
            </AnimateBorderChase>
            <em>决心是成功的开始</em>
            <em>如果你相信自己，你可以做任何事</em>
            <em>选择了就永不后悔</em>
        </div>
        <div class="text-item mobile">
            <AnimateBorderChase>
                <h2>决心是成功的开始</h2>
            </AnimateBorderChase>
        </div>
    </div>
</template>

<script>
export default {
    name: "home-banner-one",
};
</script>

<style lang="less" scoped>
.text-item.pc {
    @media (max-width: 768px) {
        display: none;
    }

    .border-chase {
        margin-bottom: 20px;
    }
}

.text-item.mobile {
    display: none;

    @media (max-width: 768px) {
        display: block;
    }

    h2 {
        @media (max-width: 768px) {
            font-size: 18px;
        }
    }
}
</style>